<template>
    <view>
        <view class="bg-white px32 pt20">
            <u-form :model="form" ref="uForm">
                <template v-if="form.type === '3'">
                    <u-form-item label="银行卡号" label-width="200" prop="account">
                        <u-input type="number" v-model="form.account" placeholder="请输入银行卡号" />
                    </u-form-item>
                    <u-form-item label="开户银行" label-width="200" prop="bank">
                        <u-input v-model="form.bank" placeholder="请输入开户银行" />
                    </u-form-item>
                    <u-form-item label="开户人" label-width="200" prop="name">
                        <u-input v-model="form.name" placeholder="请输入开户人姓名" />
                    </u-form-item>
                    <u-form-item label="手机号码" label-width="200" prop="mobile">
                        <u-input type="number" v-model="form.mobile" placeholder="请输入开户手机号码" />
                    </u-form-item>
                </template>
                <template v-if="type === 'wechat' || type === 'alipay'">
                    <u-form-item label="姓名" label-width="200" prop="name">
                        <u-input v-model="form.name" placeholder="请输入姓名" />
                    </u-form-item>
                    <u-form-item :label="type === 'wechat' ? '微信账号' : '支付宝账号'" label-width="200" prop="account">
                        <u-input v-model="form.account" :placeholder="type === 'wechat' ? '请输入微信账号' : '请输入支付宝账号'" />
                    </u-form-item>
                    <view class="pb20">
                        <view class="py30">收款码</view>
                        <u-upload :action="$uploadUrl" @on-success="uploadImg" @on-remove="uploadRemove" upload-text="收款码"
                            :preview-full-image="false" :file-list="fileList" :show-progress="false" width="180"
                            height="180" ref="uUpload" max-count="1" name="img">
                        </u-upload>
                    </view>
                </template>
            </u-form>
        </view>
        <!-- btn -->
        <view class="mt50 mx30">
            <u-button type="warning" ripple @click="submit">提交</u-button>
        </view>
        <u-toast ref="uToast" />
    </view>
</template>
<script>
import $config from '@/api/http.baseUrl.js';
export default {
    data() {
        return {
            type: '',
            form: {
                type: '',
                name: '',
                account: '',
                img: ''
            },
            rules: {
                name: [
                    {
                        required: true,
                        message: '请输入姓名',
                        trigger: ['blur']
                    }
                ],
                account: [
                    {
                        required: true,
                        message: '请输入账号',
                        trigger: ['blur']
                    }
                ]
            },
            fileList: []
        }
    },
    onLoad(option) {
        this.type = option.type
        this.form.type = option.type === 'wechat' ? 1 : 2
        uni.setNavigationBarTitle({
            title: option.title
        })
        console.log(this.$uploadUrl)
    },
    onReady() {
        this.$refs.uForm.setRules(this.rules)
    },
    methods: {
        uploadImg(e) {
            this.form.img = e.id
        },

        uploadRemove() {
            this.form.img = ''
        },
        submit() {
            console.log(this.form);
            this.$u.api.account_edit(this.form).then(res => {
                this.$refs.uToast.show({
                    title: res.msg,
                    type: 'success',
                    callback: () => {
                        uni.navigateBack({ delta: 1 })
                    }
                })
            })
        }
    },
    computed: {
        $uploadUrl() {
            return $config.baseUrl + '/system/basic/postUploadOne'
        }
    }
}
</script>
<style>
page {
    background-color: white;
}
</style>
  